<template>
	<div class="noHistory flex">
		<img src="/img/lock_page.png" class="icon" />
		<div class="desc">{{ text }}</div>
		<div class="btn" v-if="btnText" @click="$emit('btnCall')">{{ btnText }}</div>
	</div>
</template>

<script>
	export default {
		props: {
			
			// 文字
			text: {
				type: String,
				default: "没有找到记录"
			},
			
			// 创作按钮
			btnText: {
				type: String,
				default: null
			},
			
		},
		data() {
			return {
				
			}
		},
		asyncData({ app }) {
			
		},
		mounted(){
			
		},
	}
</script>

<style lang="scss" scoped>
	.noHistory{
		flex-direction: column;
		padding: 50px 50px 50px 50px;
		align-items: center;
		.icon{
			width: 150px;
		}
		.desc{
			line-height: 1.53;
			font-size: 15px;
			color: rgba(224, 245, 255, 0.65);
			margin-top: 20px;
		}
		.btn{
			margin-top: 20px;
			line-height: 2.66;
			width: 180px;
			font-size: 15px;
			text-align: center;
			background: rgba(204, 221, 255, 0.06);
			color: rgba(224, 245, 255, 0.8);
			border-radius: 100px;
			transition: 0.2s all;
			font-weight: bold;
			cursor: pointer;
			&:hover{
				opacity: 0.8;
			}
		}
	}
</style>